import React, { PureComponent } from 'react';
import { Flex, Icon, Badge } from 'antd-mobile';
import { search } from './searchbar.less';
import { routerRedux } from 'dva/router';

import sao from '../../assets/svg/saosao.svg';
import xiaoxi from '../../assets/svg/xiaoxi.svg';


export default class SearchBarMy extends PureComponent {
  render() {
    return (
      <Flex className={search} style={{background:this.props.style?"#fff":"#FF0036"}}>
        {/* <Icon type={ sao.id } style={{ margin: '0rem 0.3rem', color:this.props.style?"#333":"#fff", opacity: "0" }} /> */}
        <Flex
            onClick={()=>{
                this.props.dispatch(routerRedux.push("/gotosearch"))
            }}
            className="search_flex" justify="between"
        >
            <div>搜索你要的商品</div>
            <Icon size="xs" type="search" style={{ margin: '0rem 0.1rem' }} />
        </Flex>
          <Badge text={this.props.newNum}>
              <Icon type={ xiaoxi.id } style={{ color:this.props.style?"#333":"#fff" }} onClick={() => this.props.dispatch(routerRedux.push({pathname: "messagesCenter"}))}/>
          </Badge>
      </Flex>
    );
  }
}


/*
 * 头部搜索组件
 * */
